<template>
	<view class="ghinfo">
		<!-- 头部 -->
		<view class="ghinfo_title" :class="detailsobj.type_is?'backgroundColor_6bcbb6':'backgroundColor_989898'">
			<view class="title_top">
				<image v-if="detailsobj.type_is" src="../../static/my/qryes_a.png" mode=""></image>
				<image v-else src="../../static/my/qryes_b.png" mode=""></image>
				<view class="font18 font-ffffff">{{detailsobj.typename}}</view>
			</view>
			<view class="font15 font-ffffff">未接诊，请重新下单</view>
		</view>
		<!-- 边框 -->
		<view class="com_border"></view>
		<!-- 就诊信息 -->
		<view class="gh_title font-323232 font16 font-b">就诊信息</view>
		<view class="gh_info font-9c9c9d font15">
			<text>就诊人</text>
			<view>{{detailsobj.user_the_patient.name}}</view>
		</view>
	<!-- 	<view class="gh_info font-9c9c9d font15">
			<text>就诊卡号</text>
			<view>{{detailsobj.user_the_patient.code||''}}</view>
		</view> -->
		<view class="gh_info font-9c9c9d font15">
			<text>接诊医院</text>
			<view>{{detailsobj.doctor_info&&detailsobj.doctor_info.practice_organization?detailsobj.doctor_info.practice_organization:(detailsobj.hospital_name||'')}}</view>
		</view>
		<view class="gh_info font-9c9c9d font15">
			<text>接诊医生</text>
			<view>{{detailsobj.doctor_name}}</view>
		</view>
		<view class="gh_info font-9c9c9d font15">
			<text>医生职称</text>
			<view>{{detailsobj.academic_title_name}}</view>
		</view>
		<view class="gh_info font-9c9c9d font15">
			<text>接诊科室</text>
			<view>{{detailsobj.room_name}}</view>
		</view>
		<view class="gh_info font-9c9c9d font15">
			<text>就诊方式</text>
			<view>{{type=='tw'?'图文问诊':'视频问诊'}}</view>
		</view>
		<!-- 问诊详情 -->
		<view class="com_border margin_top"></view>
		<view class="gh_title font-323232 font16 font-b">问诊详情</view>
		<view class="gh_info font-9c9c9d font15">
			<text>问诊描述</text>
			<view>{{detailsobj.content}}</view>
		</view>
		<view class="gh_info font-9c9c9d font15">
			<text>问诊目的</text>
			<view>{{detailsobj.consultation_consult_name}}</view>
		</view>
		<view class="gh_info_is font-9c9c9d font15" v-if="imglist.length>0">
			<text>问诊图片</text>
			<view class="demeanor">
				<image mode="aspectFill" :src="item" @click="Onbanner(index)" v-for="(item,index) in imglist"
					:key="index" class="demeanor_list"></image>
			</view>
		</view>
		<view class="gh_info font-9c9c9d font15" v-else>
			<text>问诊图片</text>
			<view>暂无</view>
		</view>
		<!-- 边框 -->
		<view class="com_border margin_top"></view>
		<!-- 缴费详情 -->
		<view class="gh_title font-323232 font16 font-b">缴费详情</view>
		<view class="gh_info font-9c9c9d font15">
			<text>交易金额</text>
			<view class="font-323232 font16 font-b">￥{{detailsobj.money}}</view>
		</view>
		<view class="gh_info font-9c9c9d font15" v-if="detailsobj.coupon_id">
			<text>使用优惠券</text>
			<view class="font-323232 font16 font-b">-￥{{detailsobj.coupon_price}}</view>
		</view>
		<view class="gh_info font-9c9c9d font15">
			<text>平台单号</text>
			<view>{{detailsobj.order_code}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: null, //订单ID
				type: '', //类型
				detailsobj: {}, //详情
				imglist: [], //图片
			}
		},
		onLoad: function(options) {
			this.id = options.id
			this.type = options.type
			//订单详情
			this.Ondetails()
		},
		methods: {
			//订单详情
			Ondetails() {
				let url = ''
				let data = {}
				if (this.type == 'tw') {
					url = 'detailsConsultationOrder'
				}
				if (this.type == 'store') {
					url = 'detailsConsultationVideoOrder'
				}
				this.$Http({
					url: url,
					data: {
						order_code: this.id
					}
				}).then(res => {
					if (res.code == 1) {
						//已支付
						if (res.data.pay_status == 1) {
							if (res.data.status == 'refund') {
								res.data.typename = '订单已退款'
								res.data.type_is = false
							}
							if (res.data.status == 'normal') {
								res.data.typename = '预约成功 等待问诊'
								res.data.type_is = true
							}
							if (res.data.status == 'patient') {
								res.data.typename = '预约成功 接诊中'
								res.data.type_is = true
							}
							if (res.data.status == 'end') {
								res.data.typename = '问诊结束 待评论'
								res.data.type_is = true
							}
							if (res.data.status == 'comment') {
								res.data.typename = '问诊结束 已评论'
								res.data.type_is = true
							}
						}
						//未支付
						if (res.data.pay_status == 2) {
							if (res.data.status == 'normal') {
								res.data.typename = '预约成功 待付款'
								res.data.type_is = true
							}
							if (res.data.status == 'cancel') {
								res.data.typename = '订单已取消'
								res.data.type_is = false
							}
						}
						let images = []
						if (res.data.images == null) {
							images = []
							this.imglist = images
						} else {
							images = decodeURIComponent(res.data.images);
							images = images.split(",")
							images.forEach(item => {
								if (item != "") {
									this.imglist.push(item)
								}
							})
						}
						wx.setNavigationBarColor({
							frontColor: '#ffffff', // 必写项
							backgroundColor: res.data.type_is ? '#00B7EE' : '#989898', // 必写项
						})
						this.detailsobj = res.data
					}
				})
			},
			//放大图片
			Onbanner(e) {
				uni.previewImage({
					current: e, //预览图片的下标
					urls: this.imglist //预览图片的地址，必须要数组形式，如果不是数组形式就转换成数组形式就可以
				})
			},
		}
	}
</script>

<style>
	.ghinfo {
		padding-bottom: 150rpx;
	}

	/* 头部 */
	.ghinfo_title {
		padding: 56rpx 25rpx 38rpx 25rpx;
	}

	.backgroundColor_6bcbb6 {
		background-color: #00B7EE;
	}

	.backgroundColor_989898 {
		background-color: ##00B7EE;
	}

	.title_top {
		display: flex;
		align-items: center;
		margin-bottom: 40rpx;
	}

	.title_top image {
		height: 60rpx;
		width: 60rpx;
		margin-right: 20rpx;
	}

	/* 条码 */
	.barcode {
		padding: 38rpx 25rpx;
	}

	.barcode_img {
		width: 700rpx;
		height: 130rpx;
		margin-top: 30rpx;
		margin-bottom: 10rpx;
		/* border: 1rpx solid #6bcbb6; */
	}

	.barcode view {
		text-align: center;
	}

	/* 就诊信息 */
	.gh_title {
		margin-top: 18rpx;
		padding-left: 25rpx;
	}

	.gh_info_is {
		width: 750rpx;
		padding: 0 25rpx;
		margin-top: 18rpx;
	}
	
	.demeanor{
		width: 700rpx;
		margin-top: 10rpx;
		display: flex;
		flex-wrap: wrap;
	}
	
	.demeanor_list{
		width: 160rpx;
		height: 160rpx;
		border-radius: 5rpx;
		margin-right: 20rpx;
		margin-top: 10rpx;
	}

	.gh_info {
		display: flex;
		justify-content: space-between;
		width: 750rpx;
		padding: 0 25rpx;
		margin-top: 18rpx;
	}

	.gh_info view {
		width: 520rpx;
		text-align: right;
	}

	.margin_top {
		margin-top: 30rpx;
	}

	/* 取消订单 */
	.qx_button {
		width: 750rpx;
		height: 120rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		background-color: #f9f9f9;
	}

	.qx_button view {
		width: 650rpx;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		margin-left: 50rpx;
		margin-top: 20rpx;
		background-color: #ffffff;
	}
</style>
